<template>
	<div class="page">
		<!-- 展示列表模块 -->
		<div class="headerTop" v-loading.fullscreen="loading"
			:element-loading-text="'正在重启设备:'+nowRow.equip_name+',请稍等...'" element-loading-spinner="el-icon-loading">
			<span>所属项目:</span>
			<el-select v-model="option" placeholder="所属项目" class="inpu">
				<el-option v-for="item in products" :key='item.value' :value="item.value" :label="item.label">
				</el-option>
			</el-select>
			<!-- <el-cascader
				class="inpu"
				v-model="option"
				:options="products"
			    :props="{ checkStrictly:true,expandTrigger:'hover',emitPath:false}"
				clearable>
			</el-cascader> -->
			关键字:
			<el-input type="text" v-model="searchKey" class="inpu" placeholder="请输入名称或编码关键字"></el-input>
			<el-button type="primary" size="small" @click="searchGoods">查询</el-button>
			<el-button type="primary" size="small" @click="showAll" v-if="all && grade==3">刷新全部</el-button>
		</div>
		<div class="header_bottom" v-if="grade<=2">
			<el-button type="success" size="small" @click="add">添加网关设备</el-button>
			<el-button type="primary" size="small" @click="fromExcel">导入设备</el-button>
			<el-button type="danger" size="small" @click="deleteMany">批量删除</el-button>
			<!-- <el-button type="primary" size="small" v-if="grade==1" @click="shareEquip">分享设备</el-button> -->
			<el-button type="primary" size="small" @click="showAll" v-if="all">刷新全部</el-button>
		</div>
		<div class="container_table" id="table" >
			<el-table :data="tabledata" border id="tab" ref="tab" size="mini" row-key="id"
				@selection-change="handleSelectionChange" @row-click="getRow" :header-cell-style="{
				'background-color':tableHead,
				'color': 'white',
                'fontSize':'0.3rem',
				'height':'0.6rem',
				'line-height':'0.6rem',
				'padding':'0.1rem'
			}" :cell-style="{'fontSize':'0.3rem'}">
				<el-table-column type="expand" fixed width="40">
					<template slot-scope="props">
						<el-form label-position="right" inline>
							<div style="min-width:18%;float:left;text-align:left;">
								<el-form-item label="名称:" :label-width="formLabelWidth2">
									<span>{{ props.row.equip_name }}</span>
								</el-form-item><br>
								<el-form-item label="编码:" :label-width="formLabelWidth2">
									<span>{{ props.row.equip_code }}</span>
								</el-form-item><br>
								<el-form-item label="IMEI:" :label-width="formLabelWidth2">
									<span>{{ props.row.imei_code }}</span>
								</el-form-item><br>
								<el-form-item label="ICCID:" :label-width="formLabelWidth2">
									<span>{{ props.row.ccid_code }}</span>
								</el-form-item>
							</div>
							<div style="min-width:18%;float:left;text-align:left;margin-left:0.1rem;">
								<el-form-item label="所属项目:" :label-width="formLabelWidth2">
									<span>{{ props.row.product_name }}</span>
								</el-form-item><br>
								<el-form-item v-if="props.row.is_on==1" label="设备状态:" :label-width="formLabelWidth2">
									<span>在线/{{ props.row.is_alarm==1?'正在报警':'未报警' }}</span>
								</el-form-item>
								<el-form-item v-else label="设备状态:" :label-width="formLabelWidth2">
									<span>离线</span>
								</el-form-item>
								<br>
								<el-form-item label="联网方式:" :label-width="formLabelWidth2">
									<span>{{ props.row.network_way | netWay}}</span>
								</el-form-item><br>
								<!-- <el-form-item label="是否报警:" :label-width="formLabelWidth2">
									<span>{{ props.row.is_alarm==1?'正在报警':'未报警' }}</span>
								</el-form-item><br> -->
								<el-form-item label="启用状态:" :label-width="formLabelWidth2">
									<span>{{ props.row.equip_state==1?'已启用':'已禁用' }}</span>
								</el-form-item>
                            </div>
							<div style="min-width:14%;float:left;text-align:left;margin-left:0.1rem;">
								<!-- <el-form-item label="运行模式:" :label-width="formLabelWidth2">
									<span>{{ props.row.run_mode | runMode}}</span>
								</el-form-item><br> -->
								<el-form-item label="应用场景:" :label-width="formLabelWidth2">
									<span>{{ props.row.app_scene | appSceneToWord}}</span>
								</el-form-item><br>
								<el-form-item label="固件版本:" :label-width="formLabelWidth2">
									<span>{{ props.row.firmware_version?'V'+props.row.firmware_version:''}}</span>
								</el-form-item><br>
								<el-form-item label="设备型号:" :label-width="formLabelWidth2">
									<span>{{ props.row.equip_model?props.row.equip_model:'' }}</span>
								</el-form-item><br>
                <el-form-item v-if="props.row.network_way < 3 && props.row.version==3 && props.row.is_on == 1" label="信号强度:" :label-width="formLabelWidth2">
                	<span v-if="props.row.signal>=1 && props.row.signal<=7">微弱</span>
                  <span v-else-if="props.row.signal>=8 && props.row.signal<=14">弱</span>
                  <span v-else-if="props.row.signal>=15 && props.row.signal<=21">一般</span>
                  <span v-else-if="props.row.signal>=22">强</span>
                  <span v-else>无信号</span>
                </el-form-item>
                <el-form-item v-if="props.row.network_way < 3 && props.row.version==4 && props.row.is_on == 1" label="信号强度:" :label-width="formLabelWidth2">
                	<span v-if="props.row.signal>=-113 && props.row.signal<=-99">微弱</span>
                  <span v-else-if="props.row.signal>=-98 && props.row.signal<=-84">弱</span>
                  <span v-else-if="props.row.signal>=-83 && props.row.signal<=-69">一般</span>
                  <span v-else-if="props.row.signal>=-68 && props.row.signal<=-51">强</span>
                  <span v-else>无信号</span>
                </el-form-item>
								<!-- <el-form-item label="位置:" :label-width="formLabelWidth">
									<span>{{ props.row.geo_name }}</span>
								</el-form-item> -->
							</div>
							<div style="min-width:22%;float:left;text-align:left;margin-left:0.5rem;">

								<el-form-item label="位置:" :label-width="formLabelWidth">
									<span>{{ props.row.geo_name }}</span>
								</el-form-item><br>
								<el-form-item label="添加时间:" :label-width="formLabelWidth">
									<span>{{ props.row.add_time }}</span>
								</el-form-item><br>
								<el-form-item label="最后上线时间:" :label-width="formLabelWidth">
									<span>{{ props.row.last_con_time }}</span>
								</el-form-item><br>
								<el-form-item label="最后上报时间:" :label-width="formLabelWidth">
									<span>{{ props.row.last_data_time }}</span>
								</el-form-item>
							</div>
						</el-form>
					</template>
				</el-table-column>
				<el-table-column type="selection" width="50" reserve-selection fixed style="overflow: hidden;">
				</el-table-column>
				<!-- <el-table-column label="ID" prop="id" align="center" min-width="50" fixed>
				</el-table-column> -->
				<el-table-column label="名称" align="center" min-width="180" style="position:relative;" fixed>
					<template slot-scope="scope">
						<span :style="{'color':scope.row.is_alarm?'orangered':''}">{{scope.row.equip_name}}</span><sup
							v-if="scope.row.is_shared" class="shareSup" title="这是别人给你分享的设备">分享</sup>
					</template>
				</el-table-column>
				<el-table-column label="缩略图" align="center" min-width="80">
					<template slot-scope="scope">
						<a v-if="scope.row.image" :href="baseurl+scope.row.image" target="_blank"><img
								:src="baseurl+scope.row.thumb"
								style="width:60px;height:40px;vertical-align: middle;color:#999;" title="点击查看原图"
								alt="地址错误" /></a>
						<span v-else style="font-size:0.25rem;">暂无图片</span>
					</template>
				</el-table-column>
				<el-table-column prop="product_name" label="所属项目" align="center" min-width="200">
				</el-table-column>
				<el-table-column prop="equip_code" label="编码" align="center" min-width="180">
				</el-table-column>
				<el-table-column label="版本" align="center" width="80">
					<template slot-scope="scope">
						<span>{{scope.row.version==3?'V5.3':'V5.4'}}</span>
					</template>
				</el-table-column>
				<el-table-column label="物联卡ICCID" align="center" min-width="210">
					<template slot-scope="scope">
						<!--  工控机暂不支持读取ICCID详情-->
						<!-- <span v-if="scope.row.ccid_code" class="over" style="color:deepskyblue;cursor: pointer;" title="点击查看详情"
						@click="showCCID(scope.row.ccid_code)">{{scope.row.ccid_code}}</span> -->
						<span v-if="scope.row.ccid_code" class="over"  title="点击查看详情">{{scope.row.ccid_code}}</span>
						<i v-if="scope.row.is_on==1 && scope.row.network_way==1" class="el-icon-refresh-right newState" title="点击刷新ICCID"
							@click="getCCID(scope.row)"></i>
						<!-- 网口设备为'',没有CCID -->
						<!-- <span v-if="scope.row.ccid_code" class="over" title="点击查看详情"
							style="color:deepskyblue;cursor: pointer;"
							@click="showCCID(scope.row.ccid_code)">{{scope.row.ccid_code}}</span>
						<span v-else-if="!scope.row.ccid_code && scope.row.is_on==1" class="over" title="点击手动获取"
							style="color:deepskyblue;cursor: pointer;" @click="getCCID(scope.row)">点击手动获取</span> -->
						<!-- <span  v-else-if="scope.row.is_on==1" class="over" title="点击手动获取" style="color:deepskyblue;cursor: pointer;"  @click="getCCID(scope.row)">{{scope.row.ccid_code}}</span> -->
						<!-- 有的设备本身是没有ICCID的 -->
						<!-- <span  v-else-if="scope.row.ccid_code==='' && scope.row.is_on==1" class="over" title="可能该设备未使用物联卡,无ICCID" ></span> -->
					</template>
				</el-table-column>
				<!-- <el-table-column label="位置" align="center" min-width="220" class="over">
					<template slot-scope="scope">
						<span class="over" :title="scope.row.geo_name">{{scope.row.geo_name}}</span>
					</template>
				</el-table-column> -->
				<el-table-column prop="geo_name" label="位置" align="center" min-width="220" show-overflow-tooltip>
				</el-table-column>
				<!-- <el-table-column prop="user" label="授权用户" align="center" min-width="150">
					 <template slot-scope="scope">
						<div style="color:#1E9FFF;cursor: pointer;" @click="showUser(scope.row)">点击查看</div>
					 </template>
				</el-table-column> -->
				<el-table-column label="在线状态" align="center" :min-width="100" style="position:relative;" class="over">
					<template slot-scope="scope">
						<span :class="scope.row.is_on==1?'online':'offline'">{{scope.row.is_on==1?'在线':'离线'}}</span>
						<i class="el-icon-refresh-right newState" title="点击刷新在线状态"
							@click="refreshState(scope.row.id)"></i>
					</template>
					<!-- <template slot-scope="scope">
						<span :style="{color:scope.row.is_on?'green':'#aaa'}">{{scope.row.is_on?'在线':'离线'}}</span>
					</template> -->
				</el-table-column>
				<el-table-column label="是否报警" align="center" :min-width="100">
					<template slot-scope="scope">
						<i class="el-icon-bell" :class="scope.row.is_alarm?'alarm_on':'alarm_off'"></i>
					</template>
				</el-table-column>
				<el-table-column label="启用状态" align="center" :min-width="110">
					<template slot-scope="scope">
						<el-switch class="mar_l" v-model="scope.row.equip_state" :width="stateWidth"
							@change="sureSetState(scope.row,scope.row.equip_state)" active-color="#13ce66"
							inactive-color="#ccc" active-text="已启用" inactive-text="已禁用" :active-value="one" :inactive-value="zero">
						</el-switch>
					</template>
				</el-table-column>
				<!-- <el-table-column prop="last_data_time" label="最后数据上报时间" align="center" min-width="170">
				</el-table-column>
				<el-table-column prop="add_time" label="添加时间" align="center" min-width="170">
				</el-table-column> -->
				<!-- <el-table-column label="操作" :min-width="grade==1?'300':'160'" align="center" > -->
				<el-table-column v-if="grade<=2" label="操作" min-width="160px" align="center" fixed="right">
					<template slot-scope="scope">
						<el-button type="primary" size="mini" @click="modifyform(scope.row)">编辑</el-button>
						<!-- <el-button type="primary" size="mini" :disabled="!scope.row.equip_state" @click="lookData(scope.row)" v-if="grade!=1">监控</el-button> -->
						<el-dropdown placement="bottom" @command="handleCommand" trigger="click"
							style="margin-left:0.2rem;">
							<span type="primary" style="color:#409eff;cursor: pointer;">
								更多<i class="el-icon-arrow-down el-icon--right"></i>
							</span>
							<el-dropdown-menu slot="dropdown">
								<!-- <el-dropdown-item command="edit" >编辑</el-dropdown-item> -->
								<!-- <el-dropdown-item command="set" style="position:relative;"><i class="el-icon-warning" v-if="!nowRow.is_sync"
										style="color: red;position: absolute;right:0;top:0;" ></i>配置</el-dropdown-item> -->
                <el-dropdown-item command="set" style="position:relative;">配置</el-dropdown-item>
								<el-dropdown-item command="toExcel" style="position:relative;">
									<a  class="sendExcel" :href="$baseurl+'api/equip/exportConfigToExcel?id='+nowRow.id+'&token='+webToken">导出</a>
								</el-dropdown-item>
								<!-- <el-dropdown-item command="look" :disabled="!nowRow.equip_state">监控</el-dropdown-item> -->
								<el-dropdown-item command="restart" :disabled="!nowRow.is_on">重启</el-dropdown-item>
								<!-- <el-dropdown-item command="args">参数</el-dropdown-item> -->
								<el-dropdown-item command="copy">复制</el-dropdown-item>
								<el-dropdown-item command="delete">删除
								</el-dropdown-item>
							</el-dropdown-menu>
						</el-dropdown>
						<!-- <el-button type="primary"  size="mini" v-if="grade==1"  @click="goSlave(scope.row)" :disabled="Boolean(scope.row.is_shared)">配置</el-button> -->
						<!-- <el-button type="primary"  size="mini" :disabled="!scope.row.equip_state" @click="lookData(scope.row)">监控</el-button> -->
						<!-- <el-button @click="sureDelete(scope.row)" type="danger" v-if="grade==1" size="mini" :disabled="Boolean(scope.row.is_shared)">删除</el-button> -->


						<!-- <el-button type="success"  size="mini" v-if="grade==1 && scope.row.slaves_count==2"  @click="goSlave(scope.row)" :disabled="Boolean(scope.row.is_shared)">子设备</el-button>
						<el-button type="primary"  size="mini" v-if="grade==1 && scope.row.slaves_count==1" @click="setIt(scope.row)" :disabled="Boolean(scope.row.is_shared)">配置</el-button> -->
						<!-- <el-button type="primary" size="mini" v-if="grade==1" @click="shareEquip(scope.row)">分享</el-button> -->
						<!-- <el-button type="primary" size="mini" @click="authorize(scope.row)">授权</el-button> -->
					</template>
				</el-table-column>
			</el-table>
			<div class="pagination">
				<el-pagination style="display:inline-block;vertical-align: middle;margin-top: 0.2rem;"
					@size-change="handleSizeChange" @current-change="current_change" :current-page="queryParams.pageNo"
					:page-size="queryParams.pageSize" :page-sizes="[5,10,15]"
					layout="total, sizes, prev, pager, next, jumper" :total="queryParams.total">
				</el-pagination>
				<!-- <el-button type="priamry" size="small" class="pagebtn" @click="FullScreen">全屏/非全屏切换</el-button> -->
			</div>

		</div>
		<!-- 普通应用参数设置对话框 -->
		<el-dialog :visible="dialogArgsVisible" :width="win.screen.width>=1600?'25%':'32%'" append-to-body
			:show-close="close" top="250px">
			<div class="toptit">
				<span>设置参数-{{nowRow.equip_name }}</span>
				<span style="float: right; cursor: pointer" @click="dialogArgsVisible = false">关闭</span>
			</div>
			<div v-loading="loading2" element-loading-text="正在读取参数,请稍等..." element-loading-spinner="el-icon-loading">
				<el-form :model="argForm" style="text-align: left;margin-top:0.2rem;" block>
					<!-- <el-form-item label="运行模式:">
						<el-select v-model="argForm.run_mode" placeholder="运行模式" class="inpu" style="width:2.5rem;">
							<el-option v-for="item in runModes" :key="item.value" :label="item.label"
								:value="item.value">
							</el-option>
						</el-select>
					</el-form-item> -->
					<el-form-item v-if="versionToFloat(argForm.firmware_version)>=5.3" label="定点上报:">
						<el-switch class="mar_report" v-model="argForm.fixed_report" :width="stateWidth"
							active-color="#13ce66" inactive-color="#ccc" active-text="启用" inactive-text="禁用"
							:active-value="one" :inactive-value="zero">
						</el-switch>
					</el-form-item>
					<el-form-item label="起始时间:"
						v-if="versionToFloat(argForm.firmware_version)>=5.3 && argForm.fixed_report==1">
						<el-time-select :clearable="false" class="timeSelect" style="width: 2.5rem;margin-right:4px;"  v-model="argForm.fixed_start_time"
							:picker-options="{
							start: '00:00',
							step: '00:05',
							end: '23:55'
						  }" placeholder="选择时间">
						</el-time-select>
					</el-form-item>
					<el-form-item v-if="versionToFloat(argForm.firmware_version)>=5.3" label="上报频率:">
						<el-input class="inpu" style="width: 2.5rem;margin-right:4px;" v-model="argForm.report_interval"
							placeholder="请输上报频率"></el-input><span>{{argForm.fixed_report==1?'min':'s'}}</span>
					</el-form-item>
					<el-form-item v-else label="上报频率:">
						<el-input class="inpu" style="width: 2.5rem;margin-right:4px;" v-model="argForm.report_interval"
							placeholder="请输上报频率"></el-input>s
					</el-form-item>

					<!-- <el-form-item style="height:0.8rem;" label="">
						<span style="display:inline-block;color:red;font-size:0.3rem;line-height:0.4rem;">注：如果将运行模式由边缘采集改为数据透传</br>后,原来的子设备和数据点将丢失,请慎重操作！</span>
					</el-form-item> -->
				</el-form>
				<div style="text-align: right; margin-top: 0.2rem">
					<el-button type="primary" size="small" @click="readArgs">读 取</el-button>
					<el-button type="primary" size="small" @click="setArgs">保存并下发</el-button>
					<el-button size="small" @click="cancelSetArgs">取 消</el-button>
				</div>
			</div>
		</el-dialog>

		<!-- 水利应用设置对话框 -->
		<el-dialog :visible="dialogArgsVisible_2"
			:width="win.screen.width>=1600 && versionToFloat(argForm_2.firmware_version)<=5.3?'50%':'55%'"
			append-to-body :show-close="close" top="120px">
			<div class="toptit">
				<span>设置参数-{{nowRow.equip_name }}</span>
				<span style="float: right; cursor: pointer" @click="dialogArgsVisible_2 = false">关闭</span>
			</div>
			<div v-loading="loading3" element-loading-text="正在读取参数,请稍等..." element-loading-spinner="el-icon-loading">
				<el-form :model="argForm_2" style="text-align: left;margin-top:0.3rem;" inline>
					<el-form-item v-if="versionToFloat(argForm_2.firmware_version)>=5.3" label=""
						style="margin-top:-0.2rem;">
						<span style="font-size:0.3rem;color:#111;font-weight:700;">管理平台:</span>
					</el-form-item>
					<el-form-item v-if="versionToFloat(argForm_2.firmware_version)>=5.3" label="定点上报:"
						label-width="auto" label-position="left" style="margin-top:-0.2rem;">
						<el-switch class="mar_report" v-model="argForm_2.fixed_report" :width="stateWidth"
							active-color="#13ce66" inactive-color="#ccc" active-text="启用" inactive-text="禁用"
							:active-value="one" :inactive-value="zero">
						</el-switch>
					</el-form-item>
					<el-form-item v-if="versionToFloat(argForm_2.firmware_version)>=5.3 && argForm_2.fixed_report==1"
						label="起始时间:" label-width="auto" label-position="left"
						style="margin-top:-0.2rem;margin-left:-1.5rem;">
						<el-time-select :clearable="false" class="timeSelect" style="width: 2rem;margin-right:4px;" v-model="argForm_2.fixed_start_time"
							:picker-options="{
							start: '00:00',
							step: '00:05',
							end: '23:55'
						  }" placeholder="选择时间">
						</el-time-select>
					</el-form-item>
					<el-form-item v-if="versionToFloat(argForm_2.firmware_version)>=5.3" label="上报频率:"
						label-width="auto" label-position="left" :class="argForm_2.fixed_report==0?'reportInterval':''"
						style="margin-top:-0.2rem;margin-left:0.5rem;">
						<el-input class="inpu" style="width:2rem;margin-right:4px;" v-model="argForm_2.report_interval"
							placeholder="请输上报频率"></el-input><span>{{argForm_2.fixed_report==1?'min':'s'}}</span>
					</el-form-item>
					<el-form-item v-else label="上报频率(管理平台):" label-width="auto" label-position="left"
						style="margin-top:-0.2rem;">
						<el-input class="inpu" style="width:2rem;margin-right:4px;" v-model="argForm_2.report_interval"
							placeholder="请输上报频率"></el-input>s
					</el-form-item>
					<el-form-item label="" style="margin-top:-0.2rem;">
						<el-button type="primary" size="mini" @click="setArgs_Interval('platform')"
							style="margin-left:0.2rem;">修改</el-button>
					</el-form-item><br>
					<el-form-item v-if="versionToFloat(argForm_2.firmware_version)>=5.3" label=""
						style="margin-top:-0.2rem;">
						<span style="font-size:0.3rem;color:#111;font-weight:700;">遥测平台:</span>
					</el-form-item>
					<el-form-item v-if="versionToFloat(argForm_2.firmware_version)>=5.3" label="定点上报:"
						label-width="auto" label-position="left" style="margin-top:-0.2rem;">
						<el-switch class="mar_report" v-model="argForm_2.tcp_service.fixed_report" :width="stateWidth"
							active-color="#13ce66" inactive-color="#ccc" active-text="启用" inactive-text="禁用"
							:active-value="one" :inactive-value="zero">
						</el-switch>
					</el-form-item>
					<el-form-item
						v-if="versionToFloat(argForm_2.firmware_version)>=5.3 && argForm_2.tcp_service.fixed_report==1"
						label="起始时间:" label-width="auto" label-position="left"
						style="margin-top:-0.2rem;margin-left:-1.5rem;">
						<el-time-select :clearable="false" class="timeSelect" style="width: 2rem;margin-right:4px;"
						 v-model="argForm_2.tcp_service.fixed_start_time" :picker-options="{
							start: '00:00',
							step: '00:05',
							end: '23:55'
						  }" placeholder="选择时间">
						</el-time-select>
					</el-form-item>
					<el-form-item v-if="versionToFloat(argForm_2.firmware_version)>=5.3" label="上报频率:"
						label-width="auto" label-position="left"
						:class="argForm_2.tcp_service.fixed_report==0?'reportInterval':''"
						style="margin-top:-0.2rem;margin-left:0.5rem;">
						<el-input class="inpu" style="width:2rem;margin-right:0;"
							v-model="argForm_2.tcp_service.report_interval" placeholder="请输TCP上报频率"></el-input>
						<span>{{argForm_2.tcp_service.fixed_report==1?'min':'s'}}</span>
					</el-form-item>
					<el-form-item v-else label="上报频率(遥测平台):" label-width="auto" label-position="left"
						style="margin-top:-0.2rem;">
						<el-input class="inpu" style="width:2rem;margin-right:4px;"
							v-model="argForm_2.tcp_service.report_interval" placeholder="请输TCP上报频率"></el-input>s
					</el-form-item>
					<el-form-item label="" style="margin-top:-0.2rem;">
						<el-button type="primary" size="mini" @click="setArgs_Interval('remote')"
							style="margin-left:0.2rem;">修改</el-button>
					</el-form-item><br>
					<el-form-item label="RTU编码:" label-width="auto" label-position="left"
						style="margin-top:-0.2rem;margin-left:2px;">
						<el-input class="inpu" style="width:5rem;margin-right:4px;" v-model="argForm_2.rtu_code"
							placeholder="请输RTU编码"></el-input>
					</el-form-item>
				</el-form>

				<div class="sensorHead" style="width:100%;text-align: left;margin-left:4px;">
					<span class="inpu_4" style="width:1.8rem;">序列</span>
					<span class="inpu_4" style="width:5rem;">IP地址或域名</span>
					<span class="inpu_4" style="width:2rem;margin-left:0.2rem;">端口</span>
					<span class="inpu_4" style="width:2.1rem;margin-left:0.2rem;">使能</span>
					<div class="inpu_4" style="width:2.2rem;"><span >状态</span> | <span style="color:deepskyblue;cursor: pointer;" @click="refreshServiceState(2)">刷新</span></div>
					<!-- <el-button class="inpu_4" style="width:1.4rem;">状态</el-button> -->
				</div>
				<div style="height:3.5rem;width:100%;overflow:auto;text-align:left;">
					<div v-for="(item,n) in argForm_2.tcp_service.servers" :key="n" class="oneSensor">
						<span class="inpu_2" style="width:2rem;border:none;">服务器{{n+1}}:</span>
						<input class="inpu_2" style="width:5rem" v-model="item.ip"></input>
						<input class="inpu_2" style="width:2rem;margin-left:0.2rem;" v-model="item.port"></input>
						<span class="inpu_2" style="width:2.2rem;border:none;margin-left:0.3rem;overflow:hidden;">
							<el-switch class="mar_l" v-model="item.enable" :width="stateWidth" active-color="#13ce66"
								inactive-color="#ccc" active-text="启用" inactive-text="停用" :active-value="one"
								:inactive-value="zero">
							</el-switch>
						</span>
						<div class="inpu_2" style="width:1rem;border:none;margin-left:0.28rem;">
							<span :class="item.state==1?'yes':'no_grey'"></span>
						</div>
					</div>
				</div>
				<div style="text-align: right; margin-top: 0.1rem">
					<el-button type="primary" size="small" @click="readArgs_2">读 取</el-button>
					<el-button type="primary" size="small" @click="setArgs_2">保存并下发</el-button>
					<el-button size="small" @click="cancelSetArgs_2">取 消</el-button>
				</div>
			</div>
		</el-dialog>

		<!-- CCID信息对话框-->
		<el-dialog :visible="dialogCCIDVisible" :width="win.screen.width>=1600?'40%':'48%'" append-to-body
			:show-close="close" top="220px" :close-on-click-modal="true">
			<div class="toptit">
				<span>物联卡详情信息</span>
				<span style="float: right; cursor: pointer" @click="cannelInfo">关闭</span>
			</div>
			<el-form :model="ccidForm" style="text-align: left;margin-top:0.3rem;" inline>
				<el-form-item class="formline" label="CCID:">
					<span>{{ccidForm.iccid}}</span>
				</el-form-item>
				<el-form-item class="formline_2" label="套餐名称:">
					<span>{{ccidForm.iratePlanName}}</span>
					<!-- <span v-if="ccidForm.enableRecharge==1 && allowFinance==1" class="scan_btn"
						@click="goRecharge(ccidForm.iccid,ccidForm.ratePlanPrice)">续费</span> -->
				</el-form-item>
			    <el-form-item class="formline" label="运营商:">
					<span>{{ccidForm.carrier}}</span>
				</el-form-item>
				<el-form-item class="formline_2" label="本月使用流量:">
					<span>{{ccidForm.dataUsage}}</span> M
				</el-form-item>
				<el-form-item class="formline" label="状态:">
					<span style="color:deepskyblue;">{{ccidForm.status}}</span>
				</el-form-item>

				<el-form-item class="formline_2" label="累计使用流量:">
					<span>{{ccidForm.usedDataVolume}}</span> M
				</el-form-item>
				<el-form-item class="formline" label="过期时间:">
					<span style="color: deepskyblue;">{{ccidForm.expireDate}}</span>
				</el-form-item>
				<el-form-item class="formline_2" label="套餐剩余流量:">
					<span style="color:deepskyblue;">{{ccidForm.remainDataVolume}}</span> M
				</el-form-item>
            </el-form>
        </el-dialog>
		<!-- 复制设备对话框-->
		<el-dialog :visible="dialogCopyVisible" :width="win.screen.width>=1600?'36%':'48%'" append-to-body
			:show-close="close" top="220px">
			<div class="toptit">
				<span>复制设备：{{copyForm.old_name}}</span>
				<span style="float: right; cursor: pointer" @click="dialogCopyVisible = false">关闭</span>
			</div>
			<el-form :model="copyForm" style="text-align: left;margin-top:0.3rem;" block>
				<el-form-item class="formline_3" label="新设备所属项目:" :label-width="formLabelWidth">
					<el-select v-model="copyForm.product_id" placeholder="选择项目" style="width:5.5rem;" class="inpu">
						<el-option v-for="item in products_2" :key="item.value" :label="item.label" :value="item.value">
						</el-option>
					</el-select>
					<!-- <el-cascader
						class="inpu"
						style="width:5.5rem;"
						v-model="copyForm.product_id"
						:options="products"
						:props="{ checkStrictly:true,expandTrigger:'hover',emitPath:false}">
					</el-cascader> -->
				</el-form-item>
				<el-form-item class="formline_3" label="新设备名称:" :label-width="formLabelWidth">
					<el-input style="width: 5.5rem" class="inpu" v-model="copyForm.equip_name" placeholder="请输入新设备名称"></el-input>
				</el-form-item>
				<el-form-item class="formline_3" label="新设备编码:" :label-width="formLabelWidth">
					<el-input style="width: 5.5rem"  class="inpu" v-model="copyForm.equip_code" @input="toUpper(copyForm.equip_code)" placeholder="请输入新设备编码"></el-input>
				</el-form-item>
			</el-form>
			<p style="color:red;font-size:0.275rem;margin-left:0.9rem;">注：复制后由于两设备坐标完全一样，将导致定位重叠，建议修<br>改坐标形成错位！如是动态定位或已删除原设备，可忽略！</p>
			<div style="text-align: right; margin-top: 0.3rem">
				<el-button type="primary" size="small" @click="sureCopy">确认复制</el-button>
				<el-button size="small" @click="dialogCopyVisible = false">取 消</el-button>
			</div>
		</el-dialog>

		<!-- 导入设备对话框-->
		<el-dialog :visible="fromVisible" :width="win.screen.width>=1600?'36%':'48%'" append-to-body
			:show-close="close" top="220px">
			<div class="toptit">
				<span>导入设备</span>
				<span style="float: right; cursor: pointer" @click="cancelGet">关闭</span>
			</div>
			<el-form :model="fromForm" style="text-align: left;margin-top:0.2rem;" block>
				<!-- <el-form-item class="formline_3" style="height:auto;" label="" label-width="89px">
					<div  style="font-size:0.25rem;color:red;line-height:0.4rem!important;">
						注：1.导入设备功能仅支持V5版本设备；
					    <p style="margin-left:0.5rem;">2.导入之前请修改设备名称和设备编码,以避免重复；</p>
						<p style="margin-left:0.5rem;">3.配置文件格式请参考导出的配置文件格式；</p>
					    <p style="margin-left:0.5rem;">4.如果有多个相同配置的设备，在Excel设备工作表中添加多个设备即可批量添加；</p>
					</div>
				</el-form-item>	 -->
				<el-form-item class="formline_3" label="所属项目:" :label-width="formLabelWidth2">
					<el-select v-model="fromForm.product_id" placeholder="选择项目" class="inpu" style="width:5.5rem;">
						<el-option v-for="item in products_2" :key="item.value" :label="item.label" :value="item.value">
						</el-option>
					</el-select>
					<!-- <el-cascader
						class="inpu"
						style="width:5.5rem;"
						v-model="fromForm.product_id"
						:options="products"
						:props="{ checkStrictly:true,expandTrigger:'hover',emitPath:false}">
					</el-cascader> -->
				</el-form-item>
				<el-form-item class="formline_3" label="新设备名称:" :label-width="formLabelWidth2">
					<el-input style="width: 5.5rem" class="inpu" v-model="fromForm.equip_name" placeholder="请输入新设备名称"></el-input>
				</el-form-item>
				<el-form-item class="formline_3" label="新设备编码:" :label-width="formLabelWidth2">
					<el-input style="width: 5.5rem"  class="inpu" v-model="fromForm.equip_code" @input="toUpperFrom(fromForm.equip_code)" placeholder="请输入新设备编码"></el-input>
				</el-form-item>
				<el-form-item class="formline_3"  label="配置文件:" :label-width="formLabelWidth2">
					<div id="uploadBox" style="position:relative;display:inline-block;">
					    <input type="file" id="addid" class="inpu" @change="addUpload" style="width:5.5rem" placeholder=""  title=""/>
					    <el-input type="text" id="addInput" class="inpu"  readonly v-model="fromForm.fileName" style="width:5.5rem" placeholder="点击选择设备配置文件"></el-input>
					</div>
					<el-tooltip placement="top" effect="light">
						<div slot="content" style="line-height:0.4rem;color:red;">注：1.导入设备功能仅支持V5版本设备；
					    <p style="margin-left:0.5rem;">2.配置文件格式请参考导出的配置文件格式；</p>
					    <p style="margin-left:0.5rem;">3.在设备工作表中添加多个即可实现批量添加相同配置的设备；</p></div>
						<span class="sortIcon" style="color:red;">?</span>
					</el-tooltip>
				</el-form-item>
			</el-form>
			<div style="text-align: right; margin-top: 0.3rem">
				<el-button type="primary" size="small" @click="getFromExcel">确 认</el-button>
				<el-button size="small" @click="cancelGet">取 消</el-button>
			</div>
		</el-dialog>
	</div>
</template>

<script>
	//import QRCode from 'qrcodejs2';
	import {
		versionToFloat
	} from '../common.js';
	export default {
		name: 'device',
		data() {
			return {
				win: window,
				one: 1,
				zero: 0,
				webToken:localStorage.getItem("attoken"),
				allowFinance:Number(localStorage.getItem("allowFinance")) || 0,
				grade: Number(localStorage.getItem("atuser_type")),
				searchKey: '', //输入框内容
				baseurl: this.$baseurl,
				tableHead: localStorage.getItem("bgcolor"),
				products:[],
        products_2:[],
				option:1,
				all: false,
				close: false,
				stateWidth: 70,
				stateWidth1: 66,
				stateWidth3: 46,
				optiongroup: [],
				full: false,
				loading: false,
				loading2: false,
				loading3: false,
				loading4: false,
				versionToFloat: versionToFloat,
				nowRow: {
					id: 0,
					equip_name: '',
					equip_code: '',
					type: 1,
					product_id: 0,
					slaves_count: 1,
					//is_sync: 1,
					is_on: 0,
					report_interval: 60,
					app_scene: 1,
					//run_mode: 1,
					version:2,
					equip_state: 0,
					firmware_version: '',
					equip_model: '',
					rtu_code: '', //RTU编码
					fixed_report: 0, // 定点上报
					fixed_start_time: "", // 起始时间
					tcp_ping: {
						interval: 60,
						data: '',
						char_type: true
					},
					tcp_service: {
						report_interval: 60,
						fixed_report: 0, // 定点上报
						fixed_start_time: "08:00", // 起始时间
						servers: []
					}
				},
				//通用场景参数
				argForm: {
					firmware_version: '',
					report_interval: 60,
					fixed_report: 1, // 定点上报
					fixed_start_time: "08:00", // 起始时间
					run_mode: 1
				},
				//水利场景参数
				argForm_2: {
					firmware_version: '',
					report_interval: 60,
					fixed_report: 1, // 定点上报
					fixed_start_time: "08:00", // 起始时间
					run_mode: 1,
					rtu_code: '', //RTU编码
					tcp_service: {
						fixed_report: 1, // 定点上报
						fixed_start_time: "08:00", // 起始时间
						report_interval: 60,
						servers: []
					}
				},
				//私有协议-A场景参数
				oldData: '',
				// argForm_3: {
				// 	firmware_version: '',
				// 	report_interval: 60,
				// 	fixed_report: 1, // 定点上报
				// 	fixed_start_time: "08:00", // 起始时间
				// 	run_mode: 1,
				// 	rtu_code: '', //RTU编码
				// 	tcp_ping: {
				// 		interval: 60,
				// 		data: '',
				// 		char_type: 0
				// 	},
				// 	tcp_service: {
				// 		fixed_report: 1, // 定点上报
				// 		fixed_start_time: "08:00", // 起始时间
				// 		report_interval: 60,
				// 		servers: []
				// 	}
				// },
				// runModes: [{
				// 		value: 1,
				// 		label: '边缘采集'
				// 	},
				// 	{
				// 		value: 2,
				// 		label: '数据透传'
				// 	}
				// ],


				copyForm: {
					id: 0,
					old_name: '',
					equip_name: '',
					equip_code: '',
					product_id: 0
				},
				fromVisible:false,
				excel:null,
				fromForm:{
					product_id:1,
					equip_name:'',
					equip_code:'',
					fileName:''
				},
				multipleSelection: [], //搜索的数据传到这里
				queryParams: {
					pageNo: 1,
					pageSize: 10,
					total: 0
				},
				// shareForm: {
				// 	id: 0,
				// 	equip_name: '',
				// 	tele: '',
				// 	edit_enable: 1,
				// 	equip_auth: 1,
				// 	enable_receive: 1
				// },
				//pburl:'http://39.98.232.220:8083/',
				user: [],
				tabledata: [],
				formLabelWidth2: '120px',
				formLabelWidth: '160px',

				dialogVisible: false,
				dialogArgsVisible: false,
				dialogArgsVisible_2: false,
				dialogArgsVisible_3: false,
				dialogCCIDVisible: false,
				dialogCopyVisible: false,
				//物联卡相关
				ccidForm: {
					iccid: '', //'ccid码',
					msisdn: '', // '手机号码',
					imsi: '', // 'IMSI',
					carrier: '', //'运营商',
					ratePlanId: 0, //套餐ID
					iratePlanName: 0, // '套餐名称',
					usedDataVolume: 0, // '已使用流量',
					remainDataVolume: 0, // '套餐剩余流量',
					totalDataVolume: 0, //'套餐总流量',
					dataUsage: 0, // '本月用量',
					//ratePlanEffetiveDate:'',   //套餐生效时间',
					expireDate: '', //过期时间',
					status: '', // '状态'
					enableRecharge: 1, //是否支持续费
					ratePlanPrice: "" //套餐金额
				},
				isGetCCID: false,
				//dialogScanVisible: false,
				//dialogChangeVisible: false,
				//ratePlans: [],
				//当前套餐
				//nowPlan:'',
				//应支付金额
				//nowPrice: 0,
				//qrcode: null,
            }
		},

		created() {
			//localStorage.removeItem("deviceData");
			localStorage.removeItem("operType");
			this.searchKey = localStorage.getItem('wgKeyWord') || '';
			this.option = Number(localStorage.getItem("wgOption")) || 0;
			if (this.option || this.searchKey) {
				this.all = true;
			}
			this.queryParams.pageSize = Number(localStorage.getItem("currentSize")) || 10;
			this.queryParams.pageNo = Number(localStorage.getItem("currentNo")) || 1;
			this.getProduct();

			this.showList(this.queryParams.pageNo, this.queryParams.pageSize, this.searchKey, this.option);
		},

		// beforeRouteEnter (to, from, next) {
		//  不可以访问this;
		// 	console.log(from.name);
		//   next(vm => {
		//     vm.queryParams.pageSize = Number(localStorage.getItem("currentSize")) || 10;
		//     vm.queryParams.pageNo = Number(localStorage.getItem("currentNo")) || 1;
		//   })
		// },

		beforeRouteLeave(to, from, next) {
			// 可以访问组件实例 `this`
			//console.log(to.name);
			if (['slave', 'editDevice', 'screenData', 'addDevice', 'slaveOLD','deviceSet'].indexOf(to.name) < 0) {
				localStorage.removeItem('currentNo');
				localStorage.removeItem('currentSize');
				localStorage.removeItem('wgKeyWord');
				localStorage.removeItem('wgOption');
			} else {
				localStorage.setItem("wgKeyWord", this.searchKey);
				localStorage.setItem("wgOption", this.option);
				localStorage.setItem("currentNo", this.queryParams.pageNo);
				localStorage.setItem("currentSize", this.queryParams.pageSize);
			}
			next();
		},

		methods: {
			current_change: function(currentPage) {
				this.queryParams.pageNo = currentPage;
				this.showList(currentPage, this.queryParams.pageSize, this.searchKey, this.option);
				//console.log(currentPage)
			},
			handleSizeChange(val) {
				this.queryParams.pageSize = val;
				this.showList(this.queryParams.pageNo, val, this.searchKey, this.option);
			},

			getRow(row) {
				//最快获取is_sync;
				//this.nowRow.is_sync = row.is_sync;
				for (var key in this.nowRow) {
					this.nowRow[key] = row[key];
				}
				//console.log(this.nowRow);
			},

			handleCommand(command) {
				var that = this;
				switch (command) {
					case 'set':
						setTimeout(function() {
							that.goSlave(that.nowRow);
						}, 300)
						break;
					case 'toExcel':
						// setTimeout(function() {
						// 	that.sendToExcel(that.nowRow);
						// }, 300)
						break;
					case 'look':
						setTimeout(function() {
							that.lookData(that.nowRow);
						}, 300);
						break;
					case 'restart':
						setTimeout(function() {
							that.sureStart(that.nowRow);
						}, 300);
						break;
					case 'args':
						setTimeout(function() {
							that.showArgs(that.nowRow);
						}, 300);
						break;
					case 'copy':
						setTimeout(function() {
							that.copyDevice(that.nowRow);
						}, 300);
						break;
					case 'delete':
						setTimeout(function() {
							that.sureDelete(that.nowRow);
						}, 300);
						break;
				}
			},

			getProduct(){
				var that=this;
				this.$http({
					method: 'post',
					url: '/api/product/tree',
					data: {}
				}).then(res => {
					if (res && res.data.result == "success") {
						this.products=res.data.data;
            this.products_2 = Array.from(res.data.data);
						this.products.unshift({
							value:0,
							label:'全部'
						})
					}
					//console.log("charu")
				}).catch(error => {

					console.log(error);
				});
			},

			changeState(row, value) {
				var that = this;
				this.$http({
						method: 'post',
						url: 'api/equip/setState',
						data: {
							'equip_state': value,
							'id': row.id

						}
					})
					.then(res => {
						if (res && res.data.result == "success") {
							for (let i = 0, len = this.tabledata.length; i < len; i++) {
								if (this.tabledata[i].id == row.id) {
									//如果禁用，要做离线处理；
									this.tabledata[i].is_on = value == 1 ? this.tabledata[i].is_on : 0;
								}
							}
							this.$message({
								message: '恭喜,修改设备状态成功!',
								type: 'success',
								center: true
							});
						}
					}).catch(error => {
						console.log(error);
					});

			},

			sureSetState(row, value) {
				this.$confirm('改变状态将影响到数据的接收与显示, 是否确认此操作?', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(() => {
					this.changeState(row, value);
				}).catch(() => {
					// this.$message({
					// 	type: 'info',
					// 	message: '已取消改变状态！'
					// });
					this.showList(this.queryParams.pageNo, this.queryParams.pageSize, this.searchKey, this.option);
				});
			},

			goSlave(row) {
				//console.log(row);
				localStorage.setItem("deviceData", JSON.stringify({
					id: row.id,
					type: row.type,
					equip_name: row.equip_name,
					equip_code: row.equip_code,
					slaves_count: row.slaves_count,
					is_on: row.is_on,
					app_scene: row.app_scene || 1,
					run_mode:1,
					version:row.version || 3,
					firmware_version: row.firmware_version,
					product_id: row.product_id
				}));
				this.$router.push({
					name: 'deviceSet',
					path: '/deviceSet',
					component: 'deviceSet'
				});
		    },

			fromExcel(){
				this.fromVisible = true;
				this.fromForm.product_id=this.products_2[0].value;
				this.fromForm.equip_name='';
				this.fromForm.equip_code='';
				this.excel=null;
				this.fromForm.fileName="";
			},

			toUpperFrom(code){
				this.fromForm.equip_code=code.toUpperCase();
			},

			cancelGet(){
				document.getElementById('addid').value=null;
				this.fromVisible = false;
				this.excel=null;
				this.fromForm.fileName="";
			},

			addUpload() {
			    this.excel = null;
			    var that = this;
			    var fileLen = document.getElementById('addid').files;
			    this.excel = fileLen[0];
				this.fromForm.fileName=this.excel.name;
			},

			getFromExcel(){
				var that = this;
				var upform = new FormData();
				upform.append("product_id", that.fromForm.product_id);
				upform.append("equip_name", that.fromForm.equip_name);
				upform.append("equip_code", that.fromForm.equip_code);
				upform.append("config_file", that.excel);
				this.$http({
					method: 'post',
					url: 'api/equip/importConfigFromExcel',
					data: upform
				}).then(res => {
					if (res && res.data.result == "success") {
						this.$message({
							type: 'success',
							message: '导入设备成功！'
						});
						document.getElementById('addid').files=null;
						this.fromVisible = false;
						this.queryParams.pageNo=1;
						this.showList(1, this.queryParams.pageSize);

					}
				}).catch(error => {
					console.log(error)
				});
			},

			lookData(row) {
				localStorage.setItem("deviceData", JSON.stringify({
					id: row.id,
					type: row.type,
					equip_name: row.equip_name,
					equip_code: row.equip_code,
					slaves_count: row.slaves_count,
					is_shared: row.is_shared,
					product_id: row.product_id
				}));
				this.$router.push({
					name: 'screenData',
					path: 'screenData'
				});

			},

			sureStart(row) {
				this.$confirm('重启成功后，设备将短暂离线大约40秒，是否确认重启?', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(() => {
					this.loading = true;
					this.reStart(row);
				}).catch(() => {
					// this.$message({
					// 	type: 'info',
					// 	message: '已取消重启'
					// });
				});
			},

			reStart(row) {
				var that = this;
				this.$http({
					method: 'post',
					url: 'api/equip/restart',
					data: {
						'id': row.id
					}
				}).then(res => {
					if (res && res.data.result == "success") {
						this.$message({
							type: 'success',
							duration: 5000,
							message: '重启成功,请在40秒之后再进行操作！'
						});
						this.loading = false;
						this.showList(this.queryParams.pageNo, this.queryParams.pageSize, this.searchKey, this
							.option);
						setTimeout(function() {
							that.showList(that.queryParams.pageNo, that.queryParams.pageSize, that
								.searchKey, that.option);
						}, 40000);
					} else {
						this.loading = false;
					}
				}).catch(error => {
					this.loading = false;
					console.log(error)
				});

			},

			showArgs(row) {
				if (row.app_scene == 1) {
					this.argForm.firmware_version = row.firmware_version || 0;
					this.argForm.report_interval = row.report_interval;
					if (this.versionToFloat(row.firmware_version) >= 5.3) {
						this.argForm.fixed_report = row.fixed_report || 0;
						this.argForm.fixed_start_time = row.fixed_start_time || "08:00";
					}
					this.argForm.run_mode = Number(row.run_mode);
					this.dialogArgsVisible = true;
				} else if (row.app_scene == 2) {
					this.argForm_2.firmware_version = row.firmware_version || 0;
					this.argForm_2.report_interval = row.report_interval;
					this.argForm_2.rtu_code = row.rtu_code;
					if (this.versionToFloat(row.firmware_version) >= 5.3) {
						this.argForm_2.fixed_report = row.fixed_report || 0;
						this.argForm_2.fixed_start_time = row.fixed_start_time || "08:00";
					}
					this.argForm_2.run_mode = Number(row.run_mode);
					if (row.tcp_service && row.tcp_service.servers) {
						this.argForm_2.tcp_service = Object.assign({},row.tcp_service);
						this.argForm_2.tcp_service.servers = Array.from(row.tcp_service.servers);
						for(let i=0,len=row.tcp_service.servers.length;i<len;i++){
							this.argForm_2.tcp_service.servers[i]=Object.assign({},row.tcp_service.servers[i]);
						}
					} else {
						//						this.$message({
						//							type: 'info',
						//						    message:'暂无TCP服务器相关参数！'
						//						})
					}
					this.dialogArgsVisible_2 = true;
				}
			},

			showCCID(ccid) {
				this.dialogCCIDVisible = true;
				//this.ccidForm.iccid=ccid;
				this.$http({
					method: 'post',
					url: 'api/sim/detail',
					data: {
						'ccid_code': ccid,
					}
				}).then(res => {
					if (res && res.data.result == "success") {
						this.ccidForm = res.data.data;
					}

				}).catch(error => {
					console.log(error);
				});

			},

			getCCID(row) {
				var that = this;
				if (this.isGetCCID) {
					return;
				} else {
					this.isGetCCID = true;
					setTimeout(function() {
						that.isGetCCID = false;
					}, 5000)
					this.$http({
						method: 'post',
						url: 'api/equip/remoteGetCcid',
						data: {
							'id': row.id
						}
					}).then(res => {
						if (res && res.data.result == "success") {
							this.$message({
								type: 'success',
								message: res.data.msg
							});
							for (let i = 0, len = this.tabledata.length; i < len; i++) {
								if (this.tabledata[i].id == row.id) {
									this.tabledata[i].ccid_code = res.data.data.ccid_code;
									this.$forceUpdate();
									break;
								}
							}
						}
					}).catch(error => {
						console.log(error);
					});
				}
			},


			refreshState(id) {
				this.$http({
					method: 'post',
					url: 'api/equip/online',
					data: {
						'id': id
					}
				}).then(res => {
					if (res && res.data.result == "success") {
						this.$message({
							type: 'success',
							message: '刷新状态成功！'
						});
						//console.log(res.data.data.is_on);
						for (let i = 0, len = this.tabledata.length; i < len; i++) {
							if (this.tabledata[i].id == id) {
								this.tabledata[i].is_on = Number(res.data.data.is_on);
							}
						}
					}

				}).catch(error => {
					console.log(error);
				});

			},

			cannelInfo() {
				this.dialogCCIDVisible = false;
				for (var key in this.ccidForm) {
					this.ccidForm[key] = '';
				}
			},

			copyDevice(row) {
				this.copyForm.id = row.id;
				this.copyForm.old_name = row.equip_name;
				this.copyForm.equip_name = "";
				this.copyForm.equip_code = "";
				this.copyForm.product_id = row.product_id;
				this.dialogCopyVisible = true;

			},

			toUpper(code){
			   this.copyForm.equip_code=code.toUpperCase();
			},

			sureCopy() {
				if (!this.copyForm.equip_name) {
					this.$message({
						type: 'error',
						message: '设备名称不能为空！'
					})
					return;
				}
				this.$http({
					method: 'post',
					url: 'api/equip/copy',
					data: this.copyForm
				}).then(res => {
					if (res && res.data.result == "success") {
						this.$message({
							type: 'success',
							message: '复制设备成功！'
						});
						this.dialogCopyVisible = false;
						this.showList(this.queryParams.pageNo, this.queryParams.pageSize, this.searchKey, this
							.option);
					} else {
						this.dialogCopyVisible = false;
					}

				}).catch(error => {
					console.log(error);
				});
			},

			readArgs() {
				this.loading2 = true;
				this.$http({
					method: 'post',
					url: 'api/equip/remoteGet',
					data: {
						'id': this.nowRow.id,
					}
				}).then(res => {
					if (res && res.data.result == "success") {
						this.argForm.report_interval = res.data.data.report_interval;
						this.argForm.fixed_report = Number(res.data.data.fixed_report);
						this.argForm.fixed_start_time = res.data.data.fixed_start_time;

						this.argForm.run_mode = Number(res.data.data.run_mode);
						this.loading2 = false;
						this.$message({
							type: 'success',
							message: res.data.msg
						});
					} else {
						this.loading2 = false;
					}

				}).catch(error => {
					console.log(error);
				});
			},


			setArgs() {
				this.$http({
					method: 'post',
					url: 'api/equip/remoteSet',
					data: this.versionToFloat(this.argForm.firmware_version) >= 5.3 ? {
						'id': this.nowRow.id,
						'run_mode': this.argForm.run_mode,
						'report_interval': this.argForm.report_interval,
						'fixed_report': this.argForm.fixed_report,
						'fixed_start_time': this.argForm.fixed_start_time
					} : {
						'id': this.nowRow.id,
						'run_mode': this.argForm.run_mode,
						'report_interval': this.argForm.report_interval
					}
				}).then(res => {
					if (res && res.data.result == "success") {
						this.$message({
							type: 'success',
							message: res.data.msg
						});
						this.showList(this.queryParams.pageNo, this.queryParams.pageSize, this.searchKey, this
							.option);
					}
					this.dialogArgsVisible = false;
				}).catch(error => {
					console.log(error);
					this.dialogArgsVisible = false;
				});
			},

			cancelSetArgs() {
				this.dialogArgsVisible = false;
				this.loading2 = false;
			},

			readArgs_2() {
				this.loading3 = true;
				this.$http({
					method: 'post',
					url: 'api/equip/remoteGet',
					data: {
						'id': this.nowRow.id,
					}
				}).then(res => {
					if (res && res.data.result == "success") {
						this.argForm_2.report_interval = res.data.data.report_interval;
						this.argForm_2.rtu_code = res.data.data.rtu_code;
						this.argForm_2.fixed_report = Number(res.data.data.fixed_report);
						this.argForm_2.fixed_start_time = res.data.data.fixed_start_time;
						this.argForm_2.tcp_service = res.data.data.tcp_service;
						this.argForm_2.run_mode = Number(res.data.data.run_mode);
						this.loading3 = false;
						this.$message({
							type: 'success',
							message: res.data.msg
						});
					} else {
						this.loading3 = false;
					}

				}).catch(error => {
					console.log(error);
				});
			},

			setArgs_2() {
				this.$http({
					method: 'post',
					url: 'api/equip/remoteSet',
					data: this.versionToFloat(this.argForm_2.firmware_version) >= 5.3 ? {
						'id': this.nowRow.id,
						'run_mode': this.argForm_2.run_mode,
						'report_interval': this.argForm_2.report_interval,
						'rtu_code': this.argForm_2.rtu_code,
						'fixed_report': this.argForm_2.fixed_report,
						'fixed_start_time': this.argForm_2.fixed_start_time,
						'tcp_service': this.argForm_2.tcp_service
					} : {
						'id': this.nowRow.id,
						'run_mode': this.argForm_2.run_mode,
						'report_interval': this.argForm_2.report_interval,
						'rtu_code': this.argForm_2.rtu_code,
						'tcp_service': this.argForm_2.tcp_service
					}
				}).then(res => {
					if (res && res.data.result == "success") {
						this.$message({
							type: 'success',
							message: res.data.msg
						});
						this.showList(this.queryParams.pageNo, this.queryParams.pageSize, this.searchKey, this
							.option);
					}
					this.dialogArgsVisible_2 = false;
				}).catch(error => {
					console.log(error);
					this.dialogArgsVisible_2 = false;
				});
			},

			refreshServiceState(type){
				//this.argForm_3.tcp_service.servers = [{ip:'192.168.0.119',port:'5030',enable:1,state:1}]
				this.$http({
						method: 'post',
						url: 'api/equip/info',
						data: {
							'id':this.nowRow.id
				        }
					})
					.then(res => {
						if (res && res.data.result == "success") {
							if(res.data.data.tcp_service && res.data.data.tcp_service.servers.length){
								if(type==2){
								    this.argForm_2.tcp_service.servers = res.data.data.tcp_service.servers;
								}else{
									this.argForm_3.tcp_service.servers = res.data.data.tcp_service.servers;
								}
								this.$message({
									type: 'info',
									message:"已刷新服务器！"
								});
							}
						}
					}).catch(error => {
						console.log(error);
					});
			},

		    //单独修改管理平台和遥测平台上报频率的函数；
			//interval为platform表示修改管理平台上报频率，为remote表示修改遥测平台上报频率
			setArgs_Interval(interval = 'platform') {
				var that = this;
				var data = {};
				if (interval != 'platform') {
					var service = {
						'fixed_report': that.argForm_2.tcp_service.fixed_report,
						'fixed_start_time': that.argForm_2.tcp_service.fixed_start_time,
						'report_interval': that.argForm_2.tcp_service.report_interval
					};
				}
				if (interval == 'platform') {
					if (this.versionToFloat(this.argForm_2.firmware_version) >= 5.3) {
						data = {
							'id': that.nowRow.id,
							'fixed_report': that.argForm_2.fixed_report,
							'fixed_start_time': that.argForm_2.fixed_start_time,
							'report_interval': that.argForm_2.report_interval
						}
					} else {
						data = {
							'id': that.nowRow.id,
							'report_interval': that.argForm_2.report_interval
						}
					}
				}
				this.setArgInterval(interval, data, service);
			},

			setArgInterval(interval, data, service) {
				this.$http({
					method: 'post',
					url: 'api/equip/remoteSet',
					data: interval == 'platform' ? data : {
						'id': this.nowRow.id,
						'tcp_service': service
					}
				}).then(res => {
					if (res && res.data.result == "success") {
						this.$message({
							type: 'success',
							message: res.data.msg
						});
						this.showList(this.queryParams.pageNo, this.queryParams.pageSize, this.searchKey, this
							.option);
					}
					this.dialogArgsVisible_2 = false;
					this.dialogArgsVisible_3 = false;
				}).catch(error => {
					console.log(error);
					this.dialogArgsVisible_2 = false;
					this.dialogArgsVisible_3 = false;
				});
			},

			cancelSetArgs_2() {
				this.dialogArgsVisible_2 = false;
				this.loading3 = false;
			},

			showUser(row) {
				this.dialogFormVisible = true;
				this.user = row.user;
			},
			//获取数据函数
			showList: function(num, size, keyword, product_id) {
				var that = this;
				this.$http({
						method: 'post',
						url: 'api/equip/lists',
						data: {
							'limit': size,
							'page': num,
							'type': '1',
							'keyword': keyword,
							'product_id': product_id

						}
					})
					.then(res => {
						if (res && res.data.result == "success") {
							this.tabledata = res.data.data;
							this.queryParams.total = res.data.count;
						}
					}).catch(error => {
						console.log(error)
						this.tabledata = [];
						this.queryParams.total = 0;
						this.queryParams.pageNo = 1;
					});
			},

			// 点击搜索输入框里的内容
			searchGoods() {
				this.all = true;
				this.queryParams.pageNo = 1;
				this.showList(1, this.queryParams.pageSize, this.searchKey, this.option);
				//console.log(this.opid);
			},
			showAll() {
				this.all = false;
				this.queryParams.pageNo = 1;
				this.searchKey = '';
				this.option = 0;
				localStorage.removeItem("wgKeyWord");
				localStorage.removeItem("wgOption");
				this.showList(1, this.queryParams.pageSize);
			},
			add() {
				this.$router.push({
					name: 'addDevice',
					path: '/addDevice'
				})

			},

			deleteMany() {
				if (!this.multipleSelection[0]) {
					this.$message({
						message: "你还没有选中要删除的设备，请先选择！",
						type: 'error',
						center: true
					});
				} else {
					this.$confirm('删除这些设备后,它们将在地图上消失,设备相关数据也将清除,删除后无法恢复,是否确认删除?', '提示', {
						confirmButtonText: '确定',
						cancelButtonText: '取消',
						type: 'warning'
					}).then(() => {
						this.deleteGoods(this.multipleSelection);
					}).catch(() => {
						this.multipleSelection=[];
						this.$refs.tab.clearSelection();
						// this.$message({
						// 	type: 'info',
						// 	message: '已取消删除'
						// });
					});
				}
			},
			deleteGoods(delArr) {
				var that = this;
				let ids = new Array();
				for (let i in delArr) {
					ids.push(delArr[i].id);
				}
				this.$http({
					method: 'post',
					url: 'api/equip/delete',
					data: {
						"id": ids.join(',')

					}
				}).then(res => {
					if (res && res.data.result == "success") {
						this.$message({
							message: '恭喜，设备批量删除成功!',
							type: 'success',
							center: true
						});
                        this.multipleSelection=[];
					    this.$refs.tab.clearSelection();
						this.showList(this.queryParams.pageNo, this.queryParams.pageSize, this.searchKey, this
							.option);
						setTimeout(function() {
							if (that.tabledata.length == 0 && that.queryParams.pageNo > 1) {
								that.queryParams.pageNo--
								that.showList(that.queryParams.pageNo, that.queryParams.pageSize, that
									.searchKey, that.option);
							}
						}, 1000);
                    }
				}).catch(error => {
					console.log(error);
					// alert(error.message)
				});

			},
			//showInfo:function(id){},
			modifyform(row) {
				this.$router.push({
					name: 'editDevice',
					path: 'editDevice'
				});
				localStorage.setItem('editDeviceForm', row);
				localStorage.setItem('editDeviceId', row.id);
			},

			// 拿到选中的数据
			handleSelectionChange(val) {
				this.multipleSelection = val;
				//	console.log(val)
			},

			sureDelete(row) {
				this.$confirm('删除后设备将在地图上消失,设备相关数据也将清除,删除后无法恢复,是否确认删除?', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(() => {
					this.handleClick(row);
				}).catch(() => {
					// this.$message({
					// 	type: 'info',
					// 	message: '已取消删除'
					// });
				});
			},

			handleClick(row) {
				var that = this;
				this.$http({
					method: 'post',
					url: 'api/equip/delete',
					data: {
						"id": row.id

					}
				}).then(res => {
					if (res && res.data.result == "success") {
						this.showList(this.queryParams.pageNo, this.queryParams.pageSize, this.searchKey, this
							.option);
						setTimeout(function() {
							if (that.tabledata.length == 0 && that.queryParams.pageNo > 1) {
								that.queryParams.pageNo--
								that.showList(that.queryParams.pageNo, that.queryParams.pageSize, that
									.searchKey, that.option);
							}
						}, 1000);
					}
				}).catch(error => {
					console.log(error);
				});
			}
		}
	}
</script>

<style scoped>
	.inpu /deep/ .el-input__inner {
		padding-left: 4px;
		padding-right: 4px;
	}

	.pagination {
		display: block;
		margin: 0 auto;
		width: 80%;
		height: 1rem;
		line-height: 1rem;
	}

	/* 表格 */
	.container_table {
		width: 99.4%;
    margin-top: 0.1rem;
	}

	.marTop {
		margin-top: 0.2rem;
	}

	.inpu {
		display: inline-block;
		width: 5rem;
		height: 0.8rem !important;
		line-height: 0.8rem;
	}

	.inpu,
	.sele {
		margin-right: 0.4rem;
	}

	#table {
		padding: 0;
	}

	.dlog {
		box-sizing: border-box;
		padding: 0 !important;
		position: relative;
	}

	.alarm_off,
	.alarm_on {
		margin-left: -0.1rem;
		/* margin-top:-0.1rem; */
	}

	.online,
	.offline {
		display: inline-block;
		width: 1.1rem;
		height: inherit;
		color: #fff;
		vertical-align: middle;
	}

	.online {
		background-color: forestgreen;
	}

	.offline {
		background-color: #aaa;
	}

	.container_table /deep/ .el-form-item {
		margin-bottom: 2px;
	}

	.formline,
	.formline_2,
	.formline_3 {
		height: 0.6rem;
		line-height: 0.6rem;
		width: 54%;
		margin-top: -0.3rem;
		font-size: 0.3rem !important;
		/* border:1px solid red; */
	}

	.formline_2 {
		width: 40%;
		/* margin-top:0.2rem; */
	}

	.formline_3 {
		width: 100%;
		margin-top: 0.2rem
	}

	/* tcp服务器相关 */
	.inpu_2,
	.inpu_4 {
		display: inline-block;
		width: 3rem;
		/*font-size: 0.3rem;*/
		vertical-align: middle;
		border: 1px solid #ccc;
		border-radius: 5px;
		height: 0.6rem;
		line-height: 0.6rem;
		text-align: center;
		/* transform: translateY(-0.4rem); */
		/*margin-top: 0.1rem;*/
	}

	.inpu_4 {
		border: 0 !important;
		/*font-size: 0.3rem;*/
	}

	.mar_3_3 {
		transform: translate(0, -0.55rem) !important;
	}

	.mar_report {
		transform: translate(-1rem, 0) !important;
	}

	.mar_report /deep/ .el-switch__label--right {
		position: relative;
		right: 60px !important;
	}

	.mar_report /deep/ .el-switch__label--left {
		position: relative;
		left: 90px !important;
	}

	.oneSensor,
	.sensorHead {
		height: 0.8rem;
		line-height: 0.8rem;
		padding: 0;

	}

	.sensorHead {
		width: 100%;
		border-bottom: 1px solid #111;
		margin: 0;
		margin-top: -0.2rem;
		margin-bottom: 0.1rem;
	}

	.oneSensor {
		height: 1rem;
		line-height: 1rem;
		/*margin-top:0.2rem;*/
	}

	.oneSensor .yes,
	.oneSensor .no_grey {
		width: 0.5rem;
		height: 0.5rem;
		box-shadow: none;
		display: block;
		margin: 0 auto;
		margin-left: 0.2rem;
		/*transform: translateY(-0.15rem);*/
	}

	/* .oneSensor .no{
		background: radial-gradient(circle, white 10%, #aaa);
		box-shadow: none;
	} */

	.newState {
		font-size: 0.4rem;
		color: deepskyblue;
		position: absolute;
		right: 2px;
		top: 2px;
		z-index: 3;
	}

	.reportInterval {
		margin-left: -1.5rem !important;
	}

	.sendExcel{
		display:inline-block;
		width:100%;
		height:100%;
		color:#333;
	}

	.sendExcel:hover{
		color: #66b1ff;
	}

	#upload{
		display:inline-block;
		position:relative;
		width:5.5rem;
		height:0.7rem;
		line-height:0.7rem;
		border:1px solid red;
	}

	#addid {
		display:inline-block;
	    width:5.5rem;
		height:0.7rem;
		line-height:0.7rem;
		cursor: pointer;
	    border:1px solid red;
	    overflow: hidden;
	    position: absolute;
	    left: 0;
	    top: 0;
	    z-index: 12;
	    opacity:0;
	}

	#addInput{
		position: absolute;
		left: 0;
		top: 0;
		z-index: 1;
	}

	.sortIcon {
		display:inline-block;
		vertical-align: middle;
		margin-left:-0.1rem;
	    width: 0.3rem!important;
	    height: 0.3rem;
	    font-size: 0.25rem;
	    line-height: 0.3rem;
	    text-align: center;
	    color: #999;
	    background-color: #ccc;
	}

	.timeSelect  /deep/  .el-input__inner{
		padding-left:25px!important;
		padding-right:2px!important;
	}
</style>
